import React, {Component} from 'react';

import {Layout} from "antd";
import {connect} from "react-redux";
import {withRouter} from "react-router";
import {toggleSideMenu} from 'redux/action/app'
import { IUserInfo } from 'interface/login';
import { USER_INFO } from 'constant/app';
import TopLeft from './TopLeft'
import TopRight from "./TopRight";
const {Header}=Layout;

interface ITopHeaderState{
    userInfo:IUserInfo
}
class TopHeader extends Component<any,ITopHeaderState> {

    constructor(props){
        super(props)
        this.state={
            userInfo:JSON.parse(localStorage.getItem(USER_INFO))
        }
    }
    render() {
        return (
            <Header className="site-layout-background d-flex align-items-center justify-content-between" style={{ padding: 0 }}>
                <TopLeft/>
                <TopRight/>
            </Header>
        );
    }
}

const mapStateToProps=(state:any)=>{
    return state.app
}

const mapDispatchToProps={toggleSideMenu}

const WithConnect=connect(mapStateToProps,mapDispatchToProps)(TopHeader)
export default withRouter(WithConnect)
